<#import "../main.html" as page>
    <@page.main current="/encode" title="字符编码">

    <style type="text/css">
        input {
            outline: none;
        }

        textarea {
            resize: none;
            outline: none;
            width: 100%;
            border: none;
        }

    </style>
    <div class="divPage">
        <div class="divTitleText"></div>
        <div>
            <p>
                <select id="sltEncoding" class="mr10" style="height:36px;position:relative;top:-2px">
                    <option>UTF-8</option>
                    <option>UTF-32</option>
                    <option>Unicode</option>
                    <option>Gb2312</option>
                </select>
                <button class="jk-button mr10" id="btnEncode">编码</button>
                <button class="jk-button" id="btnDecode">解码</button>
            </p>
            <div class="divInput" id="divInputHex">
                <textarea id="txtDecode" rows="8"></textarea>
            </div>
            <div class="divInput mt20" id="divInputRgb">
                <textarea id="txtEncode" rows="8"></textarea>
            </div>
        </div>
    </div>
    <script type="text/javascript">

        $("#btnEncode").bind("click", function (e) {
            $.getJSON("/tool/encodeString", {
                str: $("#txtDecode").val(),
                encoding: $("#sltEncoding").find("option:selected").val()
            }, function (data) {
                if (data != null && data.code == 0) {
                    alert(data.msg);
                }
                else {
                    $("#txtEncode").val(data.data);
                }
            });
        });

        $("#btnDecode").bind("click", function (e) {
            $.getJSON("/tool/decodeString", {
                str: $("#txtEncode").val(),
                encoding: $("#sltEncoding").find("option:selected").val()
            }, function (data) {
                if (data != null && data.code == 0) {
                    alert(data.msg);
                }
                else {
                    $("#txtDecode").val(data.data);
                }
            });
        });


    </script>
</@page.main>